<template>
  <div class="app-container">
    <div :class="['filter-container', 'open']" style="height: 55px !important">
      <!-- 展开状态下的筛选框 -->
      <el-form ref="form" :inline="true" :model="form" label-width="80px">
        <el-form-item label="项目名称" label-width="100px">
          <el-input v-model="form.name" placeholder clearable />
        </el-form-item>
        <el-form-item label="项目类型">
          <el-select v-model="form.type" placeholder clearable>
            <el-option
              v-for="item in importanceOptions"
              :key="item.code"
              :label="item.name"
              :value="item.code"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="开始时间">
          <el-date-picker
            v-model="form.startTime"
            type="date"
            placeholder="选择开始日期"
            value-format="yyyy-MM-dd"
            :picker-options="pickerOptions1"
          ></el-date-picker>
        </el-form-item>
        <el-form-item label="结束时间">
          <el-date-picker
            v-model="form.endTime"
            type="date"
            placeholder="选择结束日期"
            value-format="yyyy-MM-dd"
            :picker-options="pickerOptions2"
          ></el-date-picker>
        </el-form-item>
        <el-form-item label="状态" label-width="50px">
          <el-select
            v-model="form.status"
            style="width: 165px"
            placeholder
            clearable
          >
            <el-option
              v-for="item in sortOptions"
              :key="item.code"
              :label="item.name"
              :value="item.code"
            />
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button
            v-waves
            class="filter-item"
            type="primary"
            icon="el-icon-search"
            @click="handleFilter"
            >查询</el-button
          >
          <el-button
            class="filter-item"
            style="margin-left: 10px"
            type="primary"
            icon="el-icon-edit-outline"
            @click="handleReset"
            >重置</el-button
          >
        </el-form-item>
      </el-form>
    </div>
    <el-button
      class="filter-item"
      type="primary"
      style="margin-bottom: 15px"
      @click="handleCreate"
      >新增</el-button
    >
    <el-button type="primary" style="margin-bottom: 15px" @click="handleInput"
      >导入项目</el-button
    >
    <el-row
      :gutter="12"
      style="height: calc(100vh - 260px); overflow-y: scroll"
    >
      <el-col v-for="item in list" :key="item.id" :span="6">
        <el-card shadow="always" style="cursor: pointer; margin-bottom: 10px">
          <div>
            <div @click="handleLook(item)">
              <p class="oneStyle">
                {{
                  item.businessType == 1
                    ? "标准后台类"
                    : item.businessType == 2
                    ? "ERP类"
                    : item.businessType == 3
                    ? "OA类"
                    : "网关"
                }}-{{ item.name }}
              </p>
              <p
                class="threeStyle"
                style="display: flex; justify-content: space-between"
              >
                <span>创建人：{{ item.createUserName }}</span>
                <span>{{ item.create_Time }}</span>
              </p>
              <div style="display: flex; justify-content: space-between">
                <span class="threeStyle"
                  >项目管理员：{{ item.admin_Name }}</span
                >
                <!-- item.status==2  color #d69d05  background#e3e2df -->
                <p class="icons_Style" :style="styleObj(item)">
                  <i style="margin-right: 3px" :class="compIcon(item)"></i>
                  {{ showStatus(item) }}
                </p>
              </div>
            </div>

            <div style="display: flex; justify-content: space-between">
              <div>
                <el-button
                  type="primary"
                  :disabled="item.status !== 3"
                  @click.stop="developLowCode(item)"
                  >开发</el-button
                >
                <!-- <el-button
                  type="primary"
                  :disabled="item.status !== 3"
                  @click.stop="handleGenerate(item)"
                  >生成</el-button
                > -->
                <el-button
                  type="primary"
                  :disabled="item.status !== 3"
                  @click.stop="handleExport(item)"
                  >导出</el-button
                >
                <el-button
                  type="primary"
                  @click.stop="handleDeploy(item)"
                  :disabled="item.status !== 3"
                  :loading="item.deployLoading"
                  >部署</el-button
                >
              </div>
              <div>
                <el-dropdown
                  @command="(command) => handleCommand(command, item)"
                >
                  <el-button
                    type="primary"
                    @click.stop=""
                    :disabled="item.status !== 3 && item.status != 5"
                  >
                    更多操作<i class="el-icon-arrow-down el-icon--right"></i>
                  </el-button>
                  <el-dropdown-menu slot="dropdown" v-if="item.status == 5">
                    <el-dropdown-item command="fengban"
                      >打开封版</el-dropdown-item
                    >
                  </el-dropdown-menu>

                  <el-dropdown-menu slot="dropdown" v-else>
                    <el-dropdown-item command="edit"
                      >编辑项目详情</el-dropdown-item
                    >
                    <el-dropdown-item command="generateCode"
                      >生成基础代码</el-dropdown-item
                    >
                    <el-dropdown-item command="fengban">{{
                      item.status == 5 ? "打开封版" : "项目封版"
                    }}</el-dropdown-item>
                  </el-dropdown-menu>
                </el-dropdown>
              </div>
            </div>
          </div>
        </el-card>
      </el-col>
    </el-row>
    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="form.page"
      :limit.sync="form.limit"
      @pagination="getList"
    />

    <el-dialog
      v-if="dialogFormVisible"
      :title="textMap[dialogStatus]"
      :visible.sync="dialogFormVisible"
      width="30%"
      :close-on-click-modal="false"
    >
      <el-form
        ref="dataForm"
        :rules="rules"
        :model="temp"
        label-position="left"
        label-width="110px"
      >
        <el-form-item label="项目名称" prop="name">
          <el-input
            v-model="temp.name"
            :disabled="isDisabled"
            placeholder
            clearable
          />
        </el-form-item>
        <el-form-item label="项目类型" prop="type">
          <el-select
            v-model="temp.type"
            placeholder
            clearable
            :disabled="isDisabled"
          >
            <el-option
              v-for="item in importanceOptions"
              :key="item.code"
              :label="item.name"
              :value="item.code"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="项目英文名称" prop="enName">
          <el-input
            v-model="temp.enName"
            :disabled="isDisabled"
            placeholder
            clearable
          />
        </el-form-item>
        <el-form-item label="项目简称" prop="shortName">
          <el-input
            v-model="temp.shortName"
            :disabled="isDisabled"
            placeholder
            clearable
          />
        </el-form-item>
        <el-form-item label="项目管理员">
          <el-select
            v-model="temp.adminId"
            placeholder
            clearable
            :disabled="isDisabled"
          >
            <el-option
              v-for="item in templateLists"
              :key="item.userId"
              :label="item.username"
              :value="item.userId"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="项目模板" prop="projectTemplateId">
          <el-select
            v-model="temp.projectTemplateId"
            placeholder
            clearable
            :disabled="isDisabled"
          >
            <el-option
              v-for="item in projectTemplateLists"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="业务类型" prop="businessType">
          <el-select
            v-model="temp.businessType"
            placeholder
            clearable
            :disabled="isDisabled"
          >
            <el-option
              v-for="item in businessLists"
              :key="item.code"
              :label="item.name"
              :value="item.code"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="项目描述">
          <el-input
            v-model="temp.description"
            type="textarea"
            placeholder
            clearable
            :disabled="isDisabled"
          />
        </el-form-item>
        <el-form-item label="引入类">
          <el-select v-model="temp.ids" multiple placeholder="请选择">
            <el-option
              v-for="item in idsLists"
              :key="item.id"
              :label="item.className"
              :value="item.id"
            >
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div v-show="!isDisabled" slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取消</el-button>
        <el-button
          type="primary"
          @click="dialogStatus === 'create' ? createData() : updateData()"
          :loading="sureloading"
          >确认</el-button
        >
      </div>
    </el-dialog>

    <el-dialog title="配置" :visible.sync="peizhiVisible" width="40%">
      <el-table :data="tableData" style="width: 100%" max-height="500">
        <el-table-column prop="name" label="文件名称" />
        <el-table-column prop="viewName" label="展示名称" />
        <el-table-column prop="pathInProject" label="文件位置" />
        <el-table-column prop="description" label="描述" />
        <el-table-column label="操作" width="120">
          <template slot-scope="scope">
            <el-button type="text" @click="handleconfigurationeEdit(scope.row)"
              >编辑</el-button
            >
          </template>
        </el-table-column>
      </el-table>
    </el-dialog>

    <el-dialog
      title="代码生成"
      :visible.sync="generationVisible"
      :modal="false"
      :close-on-click-modal="false"
    >
      <el-form :model="generationObj">
        <el-row :gutter="20">
          <el-col :span="8">
            <div class="grid-content bg-purple">
              <el-form-item label="model">
                <el-input
                  v-model="generationObj.model"
                  placeholder="请输入model"
                  clearable
                />
              </el-form-item>
            </div>
          </el-col>
          <el-col :span="8">
            <div class="grid-content bg-purple">
              <el-form-item label="author">
                <el-input
                  v-model="generationObj.author"
                  placeholder="请输入author"
                  clearable
                />
              </el-form-item>
            </div>
          </el-col>
          <el-col :span="8">
            <div class="grid-content bg-purple">
              <el-form-item label="packageName">
                <el-input
                  v-model="generationObj.packageName"
                  placeholder="请输入packageName"
                  clearable
                />
              </el-form-item>
            </div>
          </el-col>
        </el-row>
      </el-form>
      <!-- <el-button
        type="primary"
        @click="handleCclickAdd"
      >
        新增
      </el-button>-->
      <el-table :data="GenerationData" height="300" style="width: 100%">
        <el-table-column type="index" label="序号" width="50" />
        <el-table-column label="名称">
          <template slot-scope="{ row }">
            <el-input
              v-model="row.name"
              disabled
              placeholder="请输入名称"
              clearable
            />
          </template>
        </el-table-column>
        <el-table-column label="展示名称">
          <template slot-scope="{ row }">
            <el-input
              v-model="row.viewName"
              :disabled="!row.isSave"
              placeholder="请输入展示名称"
              clearable
            />
          </template>
        </el-table-column>
        <el-table-column label="描述">
          <template slot-scope="{ row }">
            <el-input
              v-model="row.remark"
              :disabled="!row.isSave"
              placeholder="请输入描述"
              clearable
            />
          </template>
        </el-table-column>
        <el-table-column label="操作" width="120">
          <template slot-scope="{ row }">
            <el-button
              v-show="!row.isSave"
              type="text"
              @click="handleEditUpdate(row)"
              >编辑</el-button
            >
            <el-button
              v-show="row.isSave"
              type="text"
              style="margin-left: 0px"
              @click="handleEditSave(row)"
              >保存</el-button
            >
            <el-button
              v-show="row.id"
              type="text"
              @click="handleCodeGeneration(row)"
              >生成代码</el-button
            >
          </template>
        </el-table-column>
      </el-table>
    </el-dialog>
    <el-dialog
      v-if="generationCodeVisible"
      title="生成代码"
      :visible.sync="generationCodeVisible"
      :close-on-click-modal="false"
      :modal="false"
    >
      <el-form
        ref="generat_ionCodeObj"
        :model="generationCodeObj"
        :rules="datasourceRule"
      >
        <el-row :gutter="10">
          <el-col :span="6">
            <div class="grid-content bg-purple">
              <el-form-item label="选择数据源" prop="datasourceConfigId">
                <el-select
                  v-model="generationCodeObj.datasourceConfigId"
                  placeholder="请选择数据源"
                  @change="(id) => datasourceconfigTable(id)"
                >
                  <el-option
                    v-for="item in tablechangeLists"
                    :key="item.id"
                    :label="item.dbName"
                    :value="item.id"
                  />
                </el-select>
              </el-form-item>
            </div>
          </el-col>
          <el-col :span="6">
            <div class="grid-content bg-purple">
              <el-form-item label="子模块" prop="moduleName">
                <el-input
                  v-model="generationCodeObj.moduleName"
                  placeholder="请输入子模块"
                  clearable
                />
              </el-form-item>
            </div>
          </el-col>
          <el-col :span="6">
            <div class="grid-content bg-purple">
              <el-form-item label="删除前缀">
                <el-input
                  v-model="generationCodeObj.delPrefix"
                  placeholder="请输入删除前缀"
                  clearable
                />
              </el-form-item>
            </div>
          </el-col>
          <el-col :span="6">
            <div class="grid-content bg-purple">
              <el-form-item label="作者名">
                <el-input
                  v-model="generationCodeObj.author"
                  placeholder="请输入作者名"
                  clearable
                />
              </el-form-item>
            </div>
          </el-col>
        </el-row>
      </el-form>
      <el-input v-model.trim="filterCode" placeholder="过滤表" clearable />
      <el-table
        :data="_codeDataLists_"
        height="300"
        style="width: 100%"
        @selection-change="selectionChange"
      >
        <el-table-column type="selection" width="50" />

        <el-table-column prop="tableName" label="表名" />
      </el-table>
      <span slot="footer" class="dialog-footer">
        <el-button @click="generationCodeVisible = false">取 消</el-button>
        <el-button type="primary" @click="handleClickgenerate">生成</el-button>
      </span>
    </el-dialog>
    <configurationeEdit
      :dialogVisible="dialogVisible"
      v-if="dialogVisible"
      :editId="editId"
    />
    <el-dialog
      title="导入项目"
      :visible.sync="dialogimportVisible"
      width="30%"
      :close-on-click-modal="false"
      v-if="dialogimportVisible"
    >
      <el-form
        ref="importForm"
        :model="importForm"
        label-position="left"
        label-width="120px"
      >
        <el-form-item
          label="项目名称："
          prop="projectName"
          :rules="[
            { required: true, message: '请输入项目名称', trigger: 'blur' },
          ]"
        >
          <el-input v-model="importForm.projectName" clearable placeholder />
        </el-form-item>
        <el-form-item
          label="项目简称："
          prop="shortName"
          :rules="[
            { required: true, message: '请输入项目简称', trigger: 'blur' },
          ]"
        >
          <el-input v-model="importForm.shortName" clearable placeholder />
        </el-form-item>
        <el-form-item label="是否网关项目：" required>
          <el-select v-model="importForm.isGateway">
            <el-option
              v-for="item in yesOrNoLists"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item
          label="项目管理员"
          prop="adminId"
          :rules="[
            {
              required: true,
              message: '请选择项目管理员',
              trigger: 'change',
            },
          ]"
        >
          <el-select v-model="importForm.adminId">
            <el-option
              v-for="item in templateLists"
              :key="item.userId"
              :label="item.username"
              :value="item.userId"
            />
          </el-select>
        </el-form-item>

        <el-form-item
          label="项目描述"
          prop="description"
          :rules="[
            { required: true, message: '请输入项目描述', trigger: 'blur' },
          ]"
        >
          <el-input
            type="textarea"
            v-model="importForm.description"
            clearable
          ></el-input>
        </el-form-item>
        <!-- :action="actionUrl" :http-request="httpRequest"-->
        <el-form-item
          label="上传"
          prop="fileList"
          :rules="[{ validator: validatorFile }]"
        >
          <el-upload
            class="upload-demo"
            drag
            :action="actionUrl"
            accept=".zip"
            :file-list="importForm.fileList"
            :disabled="isDisabled"
            :headers="headers"
            :on-success="handleAvatarSuccess"
            :on-error="onError"
            :on-remove="handleRemove"
            :before-upload="beforeAvatarUpload"
            :limit="1"
            :on-exceed="handleExceed"
          >
            <i class="el-icon-upload"></i>
            <div class="el-upload__text">
              将文件拖到此处，或
              <em>点击上传</em>
            </div>
            <!-- <div class="el-upload__tip" slot="tip">
              只能上传ZIP文件，且不超过10MB
            </div> -->
          </el-upload>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogimportVisible = false">取消</el-button>
        <el-button
          type="primary"
          @click="handleimportSure"
          :loading="loadingFlag"
          >确认</el-button
        >
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  projectModelsave,
  projectModelupdate,
  projectModellist,
  datasourcelistfindPage,
  projectlistsTemplate,
  projectTemplatedelete,
  projectfindPage,
  projectsave,
  projectupdate,
  projectgenerate,
  projectConfigfindPage,
  datasourceconfigTable,
  defaultClass,
  importProjectSave,
  getConfigDeploy,
  projectopen_project,
  projectclose_project,
} from "@/api/article";
import { getUserList } from "@/api/permission";
import waves from "@/directive/waves"; // waves directive
import Pagination from "@/components/Pagination"; // secondary package based on el-pagination 分页组件
import configurationeEdit from "./configurationeEdit";
import { getToken } from "@/utils/auth";
import { parseTime } from "@/utils";
import qs from "qs";
const calendarTypeOptions = [
  { key: "CN", display_name: "China" },
  { key: "US", display_name: "USA" },
  { key: "JP", display_name: "Japan" },
  { key: "EU", display_name: "Eurozone" },
];

export default {
  name: "ProjectmanagementItemlistpath",
  components: { Pagination, configurationeEdit },
  directives: { waves }, // 指令
  data() {
    const validatePass = (rule, value, callback) => {
      //正则的开始(^)和结束($)一般用于表单的校验
      const resg = /^[\u4e00-\u9fa5a-zA-Z0-9]+$/g;
      if (resg.test(value)) {
        callback();
      } else {
        callback("请输入项目名称,只能输入汉字字母或数字");
      }
    };
    const validatePass1 = (rule, value, callback) => {
      const resg = /^[^\u4e00-\u9fa5]+$/g;
      if (resg.test(value)) {
        callback();
      } else {
        callback("请输入英文名称");
      }
    };
    return {
      sureloading: false,
      loadingFlag: false,
      yesOrNoLists: [
        {
          value: "true",
          label: "是",
        },
        {
          value: "false",
          label: "否",
        },
      ],
      dialogimportVisible: false,
      importForm: {
        isGateway: "false",
        fileList: [],
      },
      headers: {
        token: getToken(),
      },
      actionUrl: `${process.env.VUE_APP_BASE_API}/import_project/upload_project_file`,
      idsLists: [],
      filterCode: "",
      codeDataLists: [],
      tablechangeLists: [],
      datasourceRule: {
        datasourceConfigId: [
          { required: true, message: "请选择数据源", trigger: "change" },
        ],
        moduleName: [
          { required: true, message: "请输入子模块", trigger: "blur" },
        ],
      },
      generationCodeObj: {
        datasourceConfigId: "",
        moduleName: "",
        delPrefix: "",
        author: "",
      },
      generationCodeVisible: false,
      authorLists: [],
      modelLists: [],
      generationObj: {},
      GenerationData: [],
      generationVisible: false,
      tableData: [],
      peizhiVisible: false,
      // 筛选框的 form 表单
      isDisabled: false,
      form: {
        name: "",
        type: "",
        startTime: "",
        endTime: "",
        status: "",
        page: 1,
        limit: 20,
      },
      tableKey: 0,
      list: [], // 表格数据
      total: 0, // 总条数
      listLoading: true, // 表格加载数据时的 loading
      importanceOptions: [
        {
          code: 1,
          name: "web后台",
        },
        {
          code: 2,
          name: "客户端",
        },
        {
          code: 3,
          name: "app",
        },
        {
          code: 4,
          name: "小程序",
        },
      ],
      templateLists: [],
      businessLists: [
        {
          code: 1,
          name: "标准后台类",
        },
        {
          code: 2,
          name: "ERP类",
        },
        {
          code: 3,
          name: "OA类",
        },
        {
          code: 4,
          name: "网关",
        },
      ],
      projectTemplateLists: [],
      calendarTypeOptions, // 类型的下拉选内容
      sortOptions: [
        {
          code: 1,
          name: "初始状态",
        },
        {
          code: 2,
          name: "正在生成",
        },
        {
          code: 3,
          name: "已生成",
        },
        {
          code: 4,
          name: "生成失败",
        },
      ],
      statusOptions: ["published", "draft", "deleted"], // 新增和修改弹框里面的 Status 下拉框
      temp: {
        // 新增和修改弹框 的 form 表单
        name: "",
        type: "",
        enName: "",
        shortName: "",
        adminId: "",
        projectTemplateId: "",
        businessType: "",
        description: "",
      },
      rules: {
        // 表单验证
        name: [{ required: true, validator: validatePass, trigger: "blur" }],
        enName: [{ required: true, validator: validatePass1, trigger: "blur" }],
        shortName: [
          { required: true, message: "请输入项目简称", trigger: "blur" },
        ],
        projectTemplateId: [
          { required: true, message: "请选择项目模板", trigger: "change" },
        ],
        type: [
          { required: true, message: "请选择项目类型", trigger: "change" },
        ],
        businessType: [
          { required: true, message: "请选择业务类型", trigger: "change" },
        ],
      },
      dialogFormVisible: false, // 弹框展示隐藏
      dialogStatus: "", // 弹框新增或者修改
      textMap: {
        // 弹框的标题
        update: "编辑",
        create: "新增",
      },
      downloadLoading: false, // 导出按钮 的 loading
      moudleId: "",
      codeId: "",
      tableNames: [],
      pickerOptions1: {
        disabledDate: (time) => {
          if (this.form.endTime) {
            return time.getTime() > new Date(this.form.endTime).getTime();
          }
        },
      },
      pickerOptions2: {
        disabledDate: (time) => {
          if (this.form.startTime) {
            return (
              time.getTime() <
              new Date(this.form.startTime).getTime() - 86400000
            );
          }
        },
      },
      dialogVisible: false,
      editId: 0,
      peizhiId: 0,
    };
  },
  computed: {
    _codeDataLists_() {
      if (this.filterCode) {
        return this.codeDataLists.filter((dataNews) => {
          return Object.keys(dataNews).some((key) => {
            return (
              String(dataNews[key])
                .toLowerCase()
                .indexOf(this.filterCode.toLowerCase()) > -1
            );
          });
        });
      }
      return this.codeDataLists;
    },
    compIcon() {
      return (item) => {
        return item.status == 1
          ? "el-icon-s-help"
          : item.status == 2
          ? "el-icon-loading"
          : item.status == 3
          ? "el-icon-success"
          : "el-icon-error";
      };
    },
    styleObj() {
      return (item) => {
        let color =
          item.status == 1
            ? "#1890ff"
            : item.status == 2
            ? "#d69d05"
            : item.status == 3
            ? "#67c23a"
            : "#f56c6c";
        let background =
          item.status == 1
            ? "#d1ddea"
            : item.status == 2
            ? "#e3e2df"
            : item.status == 3
            ? "rgb(232, 255, 234)"
            : "rgb(255, 236, 232)";
        return {
          color,
          background,
        };
      };
    },
    showStatus() {
      return (item) => {
        return item.status == 1
          ? "初始状态"
          : item.status == 2
          ? "正在生成"
          : item.status == 3
          ? "已生成"
          : "生成失败";
      };
    },
  },
  async created() {
    await this.getUserList();
    this.getList();
    this.projectlistsTemplate();
  },
  async activated() {
    await this.getUserList();
    this.getList();
    this.projectlistsTemplate();
    console.log(3333333);
  },
  beforeRouteEnter(to, from, next) {
    next((vm) => {
      if (
        !vm.$store.state.tagsView.cachedViews.includes(
          "ProjectmanagementItemlistpath"
        )
      ) {
        vm.$store.state.tagsView.cachedViews.push(
          "ProjectmanagementItemlistpath"
        );
      }
    });
  },
  beforeRouteLeave(to, from, next) {
    if (to.path === "/codeManagement/result") {
      if (
        !this.$store.state.tagsView.cachedViews.includes(
          "ProjectmanagementItemlistpath"
        )
      ) {
        this.$store.state.tagsView.cachedViews.push(
          "ProjectmanagementItemlistpath"
        );
      }
    } else {
      if (
        this.$store.state.tagsView.cachedViews.includes(
          "ProjectmanagementItemlistpath"
        )
      ) {
        const index = this.$store.state.tagsView.cachedViews.indexOf(
          "ProjectmanagementItemlistpath"
        );
        this.$store.state.tagsView.cachedViews.splice(index, 1);
      }
    }
    next();
  },
  methods: {
    async handleDeploy(item) {
      try {
        this.$set(item, "deployLoading", true);
        const res = await getConfigDeploy(item.id);
        if (res.code == 200) {
          if (res.data) {
            this.$message({
              message: "部署成功",
              type: "success",
            });
          } else {
            this.$message({
              message: "部署失败",
              type: "warning",
            });
          }
        }
      } catch (err) {
        this.$message({
          message: "部署失败",
          type: "warning",
        });
      } finally {
        this.$set(item, "deployLoading", false);
      }
    },
    validatorFile(rule, value, callback) {
      if (!value.length) {
        callback(new Error("请上传ZIP文件"));
      } else {
        callback();
      }
    },
    handleInput() {
      this.dialogimportVisible = true;
      this.importForm = {
        isGateway: "false",
        fileList: [],
      };
    },
    async defaultClass() {
      this.idsLists = [];
      const res = await defaultClass();
      if (res?.code === 200) {
        this.idsLists = res.data;
      }
    },
    developLowCode(item) {
      sessionStorage.setItem("developLowCodeId", item.id);
      sessionStorage.setItem("developLowCodeName", item.name);
      sessionStorage.setItem(
        "developLowCodeTitle",
        `${
          item.businessType == 1
            ? "标准后台类"
            : item.businessType == 2
            ? "ERP类"
            : item.businessType == 3
            ? "OA类"
            : "网关"
        }-${item.name}`
      );
      this.$router.push({
        name: "developLowCode",
      });
    },
    async handleExport(item) {
      this.$message({
        showClose: true,
        message: "正在导出...",
        type: "warning",
        showClose: true,
      });
      window.location.href = `${
        process.env.VUE_APP_BASE_API
      }/projectManage/project/download?${qs.stringify({
        id: item.id,
        token: getToken(),
      })}`;
    },
    async datasourcelistfindPage() {
      this.generationCodeObj.datasourceConfigId = "";
      const res = await datasourcelistfindPage();
      if (res?.code === 200) {
        this.tablechangeLists = res.data;
        this.generationCodeObj.datasourceConfigId =
          this.tablechangeLists?.length && this.tablechangeLists[0].id;
      }
    },
    // 选择表table数据
    async datasourceconfigTable(id) {
      this.codeDataLists = [];
      const res = await datasourceconfigTable(id);
      if (res?.code === 200) {
        this.codeDataLists = res.data;
      }
    },
    selectionChange(valObj) {
      this.tableNames = valObj;
    },
    // 生成接口
    handleClickgenerate() {
      const tableNames = this.tableNames.map((item) => item.tableName);
      this.$refs.generat_ionCodeObj.validate((valid) => {
        if (valid) {
          const config = JSON.stringify({
            // ...this.generationObj,
            moduleId: this.moudleId,
            projectId: this.codeId,
            ...this.generationCodeObj,
            tableNames,
          });
          this.$router.push(
            `/codeManagement/result?config=${config}&project=true`
          );
        }
      });
    },

    handleCclickAdd() {
      this.GenerationData.push({
        name: "",
        viewName: "",
        remark: "",
        isSave: true,
      });
    },
    async projectModellist(id) {
      this.GenerationData = [];
      const res = await projectModellist(id);
      if (res?.code === 200) {
        this.GenerationData = res.data;
      }
    },
    async handleEditSave(row) {
      if (row.id) {
        const res = await projectModelupdate({
          projectId: this.codeId,
          id: row.id,
          name: row.name,
          viewName: row.viewName,
          remark: row.remark,
        });
        if (res?.code === 200) {
          this.$message({
            message: "修改成功",
            type: "success",
          });
          row.isSave = false;
        }
      } else {
        const res = await projectModelsave({
          projectId: this.codeId,
          name: row.name,
          viewName: row.viewName,
          remark: row.remark,
        });
        if (res?.code === 200) {
          this.$message({
            message: "保存成功",
            type: "success",
          });
          row.id = res.data.id;
          row.isSave = false;
        }
      }
    },
    async handleEditUpdate(row) {
      this.$set(row, "isSave", true);
    },
    async handleCodeGeneration(row) {
      this.moudleId = row.id;
      this.generationCodeVisible = true;
      this.filterCode = "";
      this.generationCodeObj.moduleName = "";
      this.generationCodeObj.delPrefix = "";
      this.generationCodeObj.author = "";
      await this.datasourcelistfindPage();
      this.datasourceconfigTable(
        this.tablechangeLists?.length && this.tablechangeLists[0].id
      );
    },

    handleconfigurationeEdit(row) {
      this.dialogVisible = true;
      this.editId = row.id;
      //this.$router.push(`configurationeEdit?id=${row.id}`)
    },
    // 获取表格数据
    getList() {
      this.listLoading = true;
      projectfindPage(this.form).then((response) => {
        this.list = response.data.list;
        this.list.forEach((item) => {
          if (item.adminId) {
            const obj = this.templateLists.find(
              (v) => v.userId === item.adminId
            );
            this.$set(item, "admin_Name", obj ? obj.username : "");
          }
          if (item.createTime) {
            item.create_Time = parseTime(item.createTime);
          }
        });
        this.total = response.data.totalCount;
        setTimeout(() => {
          this.listLoading = false;
        }, 1.5 * 1000);
      });
    },
    async getUserList() {
      this.templateLists = [];
      const res = await getUserList();
      if (res?.code === 200) {
        this.templateLists = res.data;
      }
    },

    async projectlistsTemplate() {
      this.projectTemplateLists = [];
      const res = await projectlistsTemplate();
      if (res?.code === 200) {
        this.projectTemplateLists = res.data;
      }
    },
    handleLook(item) {
      this.isDisabled = true;
      this.dialogFormVisible = true;
      this.temp = JSON.parse(JSON.stringify(item));
    },
    // 重新获取表格数据 页码归为1
    handleFilter() {
      this.form.page = 1;
      this.getList();
    },
    handleReset() {
      this.form = {
        name: "",
        type: "",
        startTime: "",
        endTime: "",
        status: "",
        page: 1,
        limit: 20,
      };
      this.getList();
    },
    // 新增数据-打开弹框
    handleCreate() {
      this.isDisabled = false;
      this.dialogStatus = "create";
      this.temp = {
        name: "",
        type: "",
        enName: "",
        shortName: "",
        adminId: "",
        projectTemplateId: "",
        businessType: "",
        description: "",
      };
      this.dialogFormVisible = true;
      this.defaultClass();
    },
    // handleEdit(item) {
    //   this.isDisabled = false;
    //   this.dialogFormVisible = true;
    //   this.dialogStatus = "update";
    //   this.defaultClass();
    //   this.temp = JSON.parse(JSON.stringify(item));
    // },
    // handleGeneration(item) {
    //   this.generationVisible = true;
    //   this.generationObj = {};
    //   this.codeId = item.id;
    //   this.projectModellist(item.id);
    // },
    async handleCommand(command, item) {
      if (command == "edit") {
        this.isDisabled = false;
        this.dialogFormVisible = true;
        this.dialogStatus = "update";
        this.defaultClass();
        this.temp = JSON.parse(JSON.stringify(item));
      } else if (command == "generateCode") {
        this.generationVisible = true;
        this.generationObj = {};
        this.codeId = item.id;
        this.projectModellist(item.id);
      } else if (command == "fengban") {
        if (item.status == 5) {
          const res = await projectopen_project(item.id);
          if (res) {
            this.$message({
              message: "打开封板成功",
              type: "success",
            });
            this.getList();
          } else {
            this.$message({
              message: "打开封板失败",
              type: "warning",
            });
          }
        } else {
          const res = await projectclose_project(item.id);
          if (res) {
            this.$message({
              message: "项目封板成功",
              type: "success",
            });
            this.getList();
          } else {
            this.$message({
              message: "项目封板失败",
              type: "warning",
            });
          }
        }
      }
    },
    // 新增数据-表单提交
    createData() {
      this.$refs["dataForm"].validate((valid) => {
        if (valid) {
          this.sureloading = true;
          projectsave(this.temp)
            .then((res) => {
              if (res?.code === 200) {
                this.sureloading = false;
                this.dialogFormVisible = false;
                this.$message({
                  // message: res.message,
                  message: "新增成功",
                  type: "success",
                });
                this.getList();
              }
            })
            .catch((err) => {
              this.sureloading = false;
            });
        }
      });
    },
    // 修改 -- 提交表单
    updateData() {
      this.$refs["dataForm"].validate((valid) => {
        if (valid) {
          this.sureloading = true;
          projectupdate(this.temp)
            .then(() => {
              this.sureloading = false;
              this.dialogFormVisible = false;
              this.$message({
                // message: res.message,
                message: "修改成功",
                type: "success",
              });
              this.getList();
            })
            .catch((err) => {
              this.sureloading = false;
            });
        }
      });
    },
    async handleDelete(item) {
      this.$confirm(`确定要进行删除操作?`, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(async () => {
        const res = await projectTemplatedelete(item.id);
        if (res?.code === 200) {
          this.$message({
            // message: res.message,
            message: "删除成功",
            type: "success",
          });
          this.getList();
        }
      });
    },
    async handleGenerate(item) {
      this.$confirm(`确定要进行生成操作?`, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(async () => {
        const res = await projectgenerate(item.id);
        if (res?.code === 200) {
          this.$message({
            // message: res.message,
            message: res.message,
            type: "success",
          });
          this.getList();
        }
      });
    },
    async handleConfiguration(item) {
      this.peizhiVisible = true;
      this.peizhiId = item.id;
      this.projectConfigfindPage(item.id);
    },
    async projectConfigfindPage(id) {
      this.tableData = [];
      const res = await projectConfigfindPage(id);
      if (res?.code === 200) {
        this.tableData = res.data;
      }
    },
    handleAvatarSuccess(res, file, fileList) {
      this.importForm.fileList = fileList;
      this.$message({
        message: "上传成功",
        type: "success",
      });
      this.$refs["importForm"].validateField("fileList");
    },
    onError(err, file, fileList) {
      this.importForm.fileList = fileList;
      this.$message({
        message: "上传失败",
        type: "error",
      });
    },
    //
    handleRemove(file, fileList) {
      if (file && file.status === "success") {
        //这个判断解决element上传组件before-upload返回false自动调用before-remove on-remove钩子问题
        this.importForm.fileList = fileList;
      }
    },
    beforeAvatarUpload(file) {
      const index = file.name.lastIndexOf(".");
      const iszip = file.name.slice(index) === ".zip";
      // const isLt2M = file.size / 1024 / 1024 <= 10;
      if (!iszip) {
        this.$message.error("上传文件只能是ZIP格式");
        return false;
      }
      // if (!isLt2M) {
      //   this.$message.error("上传文件大小不能超过10MB");
      // }
      // return iszip && isLt2M;
      return iszip;
    },
    handleExceed(files, fileList) {
      this.$message.warning(
        `当前限制选择 1 个文件，本次选择了 ${files.length} 个文件，共选择了 ${
          files.length + fileList.length
        } 个文件`
      );
    },
    handleimportSure() {
      this.$refs["importForm"].validate((valid) => {
        if (valid) {
          const importForm = JSON.parse(JSON.stringify(this.importForm));
          const uploadObj = this.importForm.fileList.length
            ? this.importForm.fileList[0].response.data
            : {};
          Object.assign(importForm, uploadObj);
          this.loadingFlag = true;
          importProjectSave(importForm)
            .then((res) => {
              if (res?.code === 200) {
                this.dialogimportVisible = false;
                this.$message({
                  message: "导入成功",
                  type: "success",
                });
                this.getList();
              }
            })
            .finally(() => {
              this.loadingFlag = false;
            });
        }
      });
    },
  },
};
</script>
<style lang="scss" scoped>
//表格布局的注释：
//$rowLength 这个变量表示了 筛选的搜索框会有多少行，由于在不同宽度显示器下 所占行数会不一定 ，所以下面使用媒体查询 做兼容
//最小兼容至 1366
@import "~@/styles/layout-table.scss";
$rowLength: 2;
@media all and (min-width: 1659px) {
  $rowLength: 2;
  @include calculation($rowLength: $rowLength);
}
@media all and (max-width: 1659px) {
  $rowLength: 3;
  @include calculation($rowLength: $rowLength);
}
</style>
<style>
.icons_Style {
  display: inline-block;
  padding: 7px 15px;
  font-size: 12px;
  border-radius: 3px;
  opacity: 1.5;
  margin-top: 0px;
}
</style>
